Hugo Now: Porting A Theme To Hugo

Table of Contents

Create a Theme #

Simple as hugo new theme [name]. Documentation can be found here: Hugo Themes

Hugo, due to it being only a few years old, has fewer themes compared to Jekyll

Luckily, it’s expected that you will want to port a theme to Hugo. I decided to port this blog’s theme: Jekyll Now, to Hugo.

Jekyll Now #

A very popular theme jekyll-now (3,701 , 15,076 ), I wanted to retain the spirit of Jekyll Now while updating it’s dependencies as the last commit was over a year ago.

Features #

Bootstrap V4
Update from Bootstrap 3 to 4
Font Awesome
Latest Font Awesome icons
Progressive Enhancement
Disabling Javascript should retain the same experience.
Powerful Styling
Using the power of SASS to power our build pipeline. All major dependencies have .scss support.
Modern Build Pipeline
Without Jekyll's Asset pipeline, a Hugo theme needs a build system. I opted for gulp.js
Syntax Highlighting

Rather then using a JS library like hightlight.js I opt for server-side rendering with Pygments to keep in line with progressive enhamcements. Here is Hugo's opinion on the matter:

The advantage of server side is that it doesn’t depend on a JavaScript library and consequently works very well when read from an RSS feed.

I would argue site usability / robustness far out weighs build times.
Google Analytics
Configure Google Analytics with .Params.GoogleAnalytics